<template>
  <div>
    <div class="list" v-if="list.length > 0">
      <div class="item" v-for="(item, index) in newList" :key="index">
        <a :href="item.path" target="_blank">
          <div class="text">{{ item.name }}</div>
          <div class="date">{{ item.date }}</div>
        </a>
      </div>
    </div>
    <div class="empty" v-else>{{ emptyText }}</div>
  </div>
</template>

<script>
export default {
  name: "fileList",
  props: {
    list: {
      type: Array,
      default() {
        return [];
      },
    },
    emptyText: {
      type: String,
      default: "",
    },
  },
  computed: {
    newList() {
      let list = [...this.list];
      list.map((item) => {
        item["path"] = `${process.env.VUE_APP_BASE_API}/${item.file}`;
      });
      return list;
    },
  },
  data() {
    return {};
  },
  methods: {},
};
</script>

<style scoped lang="less">
.list {
  width: 1200px;
  margin: 0 auto;

  .item {
    cursor: pointer;
    color: #474747;
    a {
      display: flex;
      justify-content: space-between;
      height: 50px;
      line-height: 50px;
      color: #474747;
    }
	a:hover{
		color:#255389
	}
    .text {
      padding-left: 15px;
      width: 1000px;
      word-break: keep-all;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
    }

    .date {
      padding-right: 15px;
    }
  }

  .item:nth-of-type(odd) {
    background-color: #eeeaf3;
  }
}

.empty {
  font-weight: 600px;
  margin: 50px 0;
  text-align: center;
}
</style>
